<template>
  <div id="userRule">
    <el-table v-loading="loading" :data="tableData" stripe style="width: 100%">
      <el-table-column type="index" width="60" align="center" label="序号">
        <template slot-scope="scope">
          {{ scope.$index | filterPage(searchParams.pageNum, searchParams.pageSize) }}
        </template>
      </el-table-column>
      <el-table-column label="编号名称" prop="role"></el-table-column>
      <el-table-column label="用户群" prop="time"></el-table-column>
      <el-table-column label="编号描述" prop="channel"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: 'userRule',
  msg: '官方征集自评活动/查看详情/预置用户规则',
  data() {
    return {
      loading: true,
      page: 1, // 当前页数
      row: 10, // 页面显示条数
      total: 50,
      searchParams: {
        pageNum: 1, // 当前页数
        pageSize: 10 // 页面显示条数
      },
      tableData: [
        {
          userId: 1,
          role: '一等奖用户',
          time: '3456789',
          channel: '描述编号的相关内容和大概意思'
        },
        {
          userId: 2,
          role: '二等奖用户',
          time: '3456789',
          channel: '描述编号的相关内容和大概意思'
        },
        {
          userId: 3,
          role: '三等奖用户',
          time: '3456789',
          channel: '描述编号的相关内容和大概意思'
        },
        {
          userId: 4,
          role: '一等奖用户',
          time: '3456789',
          channel: '描述编号的相关内容和大概意思'
        },
        {
          userId: 5,
          role: '一等奖用户',
          time: '3456789',
          channel: '描述编号的相关内容和大概意思'
        },
        {
          userId: 6,
          role: '一等奖用户',
          time: '3456789',
          channel: '描述编号的相关内容和大概意思'
        }
      ] // table内容
    }
  },
  mounted() {
    this.searchList()
  },
  methods: {
    /* 获取列表 */
    searchList() {
      this.loading = false
    },
    /* 换页 */
    changePage(page) {
      this.page = page
      this.searchList()
    }
  }
}
</script>

<style lang="less">
// #userRule {
// }
</style>
